<!--  -->
<template>
  <div class="group-item" @click="gotoDetails">
    <div class="grou-head flex-a-c flex-j-sb">
      <div class="head-title" v-if="childTabIndex != 4">{{ item.group_name }}<span v-if="item.member_count">（{{ item.member_count }}人）</span></div>
      <div class="head-title" v-else>会员昵称：{{ item.name }}</div>
      <div class="head-icon flex-a-c">
        <span class="icon-fenxiang1 iconfont" @click.stop="showQrcode(1)" v-if="share"></span>
        <span class="icon-material_goodsCode iconfont" @click.stop="showQrcode(0)" v-if="childTabIndex != 4"></span>
      </div>
    </div>
    <div class="grout-content">
      <slot name="content"></slot>
      <div class="group-time" v-if="item.group_created_time_str">创建时间：{{ item.group_created_time_str }}</div>
      <div class="group-member flex-a-c" v-if="level == 0">
        <h3>锁客会员:</h3> 
        <template v-if="item.group_owner_member_uid">
          <van-image
            round
            width="20px"
            height="20px"
            :src="item.group_owner_member_avatar"
          />
          <p>{{ item.group_owner_member_nickname }}</p>
        </template>
        <p v-else>无</p>
      </div>
      <div class="group-member  flex-a-c" v-if="level == 1 && childTabIndex !== 4">
        <h3>邀请会员数：{{ item.has_many_member_log_count }}</h3> 
      </div>
    </div>
   
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import { Image as VanImage } from "vant";
export default {
name:'groupItem',
props: ["item", "share","level","childTabIndex"],
//import引入的组件需要注入到对象中才能使用
components: { VanImage },
data() {
return {

};
},
//监听属性 类似于data概念
computed: {},
//监控data中的数据变化
watch: {},
//方法集合
methods: {
  showQrcode(status) {
    this.$emit("handQrcode", { id: this.item.id, is_worker: status });
  },
  gotoDetails() {
    if(this.childTabIndex != 4) {
      this.$router.push(this.fun.getUrl("gduEnterpriseDetails", {}, { level: this.level, group_id: this.item.id }));
    }
    
  }
},
//生命周期 - 创建完成（可以访问当前this实例）
created() {

},
//生命周期 - 挂载完成（可以访问DOM元素）
mounted() {

},
beforeCreate() {}, //生命周期 - 创建之前
beforeMount() {}, //生命周期 - 挂载之前
beforeUpdate() {}, //生命周期 - 更新之前
updated() {}, //生命周期 - 更新之后
beforeDestroy() {}, //生命周期 - 销毁之前
destroyed() {}, //生命周期 - 销毁完成
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang="scss" scoped>
/* @import url(); 引入公共css类 */
  .group-item {
    background: #FFFFFF;
    border-radius: 8px 8px 8px 8px;
    padding:16px 10px 13px 10px;
    margin:0 0 10px 0;
    .grou-head {
      padding:0 0 14px 0;
      border-bottom: 1px solid  #F0F0F1;
      .head-title {
        text-align: left;
        font-weight: bold;
        font-size: 15px;
        color: #00001C;
        span {
          font-weight: 400;
          font-size: 13px;
          color: #6E6E79;
        }
      }
      .head-icon {
        .icon-material_goodsCode {
          font-weight: bold;
          font-size: 18px;
          margin:0 0 0 26px;
        }
      }
    }
    .group-time {
      text-align: left;
      padding:13px 0 0 0;
      font-size: 13px;
      color: #6E6E79;
    }
    .group-member {
      text-align: left;
      padding:4px 0 0 0;
      font-size: 13px;
      color: #6E6E79;
      h3 {
        padding:0 8px 0 0;
        font-weight: 500;
      }
      p {
        font-size: 13px;
        color: #6E6E79;
        padding:0 0 0 4px;
      }
    }
    .invite-pb {
      padding: 0.8125rem 0 0 0;
    }
  }
</style>